<style>
    .trace,
    .trace-item,
    .trace-small {
        box-sizing: border-box;
    }

    .trace {
        width: 100%;
        position: fixed;
        z-index: 999;
        left: 0;
        bottom: 0;
        background-color: #fff;
        border-top: 2px solid #ddd;
    }

    .trace-item {
        width: 31%;
        float: left;
        overflow: hidden;
        padding: 10px 1%;
    }

    .trace-item>.title {
        line-height: 50px;
        font-size: 15px;
        font-weight: bold;
        color: #666;
        border-bottom: 1px solid #E9E9E9;
    }

    .trace-item>.text {
        line-height: 2.2em;
        font-size: 13px;
        padding: 20px 0;
        height: 158px;
        overflow-y: auto;
        margin: 8px 0;
    }

    .trace-item>.text .sql {
        border-bottom: 1px solid #ccc;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    .trace-item>.text .sql span {
        color: #888;
        font-size: 16px;
    }

    .trace-item>.text .sql i {
        color: #FF0036;
    }

    .trace-item>.text .sql a {
        font-size: 13px;
        color: #3688FF;
    }

    .trace-item>.text .sql b {
        font-weight: 700;
        font-size: 13px;
    }

    .green {
        color: green;
    }

    .red {
        color: red;
    }

    .trace-small {
        padding: 8px;
        background-color: #f5f5f5;
        border: 2px solid #4B476D;
        border-right: none;
        position: fixed;
        right: 0;
        bottom: 300px;
        border-bottom-left-radius: 30px;
        border-top-left-radius: 30px;
        box-shadow: 1px 1px 18px #ddd;
        cursor: pointer;
        overflow: hidden;
    }

    .trace-small img {
        float: left;
        width: 38px;
        border-radius: 38px;
    }

    .trace-small-msg {
        margin: 0 8px;
        float: left;
        overflow: hidden;
        font-size: 13px;
        line-height: 20px;
        color: #333;
    }
</style>

<?php
/**
 * 时间、内存开销计算
 * @return array(耗时[毫秒], 消耗内存[K])
 */
function cost()
{
    return array(
        round((microtime(true) - START_TIME) * 1000, 2),
        round((memory_get_usage() - START_MEMORY) / 1024, 2)
    );
}

$cost = cost();
$includedFiles = get_included_files();
$traceSql = $GLOBALS['traceSql'] ?? []; // 避免直接使用 $GLOBALS
?>

<div class="trace collapse" id="trace">
    <div class="trace-item">
        <div class="title">运行信息</div>
        <div class="text">
            远程时间 : <?= date('Y-m-d H:i:s'); ?><br>
            运行耗时 : <?= $cost[0]; ?> 毫秒<br>
            内存消耗 : <?= $cost[1]; ?> k<br>
        </div>
    </div>
    <div class="trace-item">
        <div class="title">加载文件 [ <?= count($includedFiles); ?> ]</div>
        <div class="text">
            <?php foreach ($includedFiles as $k => $file) : ?>
                <?= $k + 1; ?> - <?= $file; ?> <br>
            <?php endforeach; ?>
        </div>
    </div>
    <div class="trace-item">
        <div class="title">SQL 运行日志 [<?= count($traceSql); ?>条]</div>
        <div class="text">
            <?php foreach ($traceSql as $k => $sql) : ?>
                <div class="sql">
                    <p>查询 <?= $k + 1; ?></p>
                    结果：<?php
                        if (isset($sql['status'])) {
                            if ($sql['status'] === '成功') {
                                echo '<b class="green">' . $sql['status'] . '</b>';
                            } else {
                                echo '<b class="red">'   . $sql['status'] . '</b>';
                            }
                        } else {
                            echo '<b class="red">未知</b>';
                        }
                        ?> &nbsp;&nbsp;耗时：<?= $sql['time']; ?> 毫秒 <br>
                    语句：<?= isset($sql['sql']) ? htmlspecialchars($sql['sql'], ENT_QUOTES, 'UTF-8') : '无'; ?><br />
                    <?php if (isset($sql['error']) && !empty($sql['error'])) {
                        echo '错误：<i>' . htmlspecialchars($sql['error'], ENT_QUOTES, 'UTF-8') . '</i>';
                    } ?>
                </div>
            <?php endforeach ?>
        </div>
    </div>
</div>
<div class="trace-small" data-bs-toggle="collapse" href="#trace" role="button" aria-expanded="false" aria-controls="trace">
    <img src="" alt="">
    <div class="trace-small-msg">
        耗时 : <?= $cost[0]; ?> 毫秒<br />
        内存 : <?= $cost[1]; ?> k
    </div>
</div>
